import Vue from 'vue'
import App from './App.vue'
// 引入库
import Vuex from 'vuex'
// 安装
Vue.use(Vuex)
// 创建仓库实例
const store = new Vuex.Store({
  strict: true,
  state: {
    count: 0,
    name: 'tom',
    age: 13,
    list: [1,2,3,4,5,6,7,8,9,10, 666],
    student: {
      name: '大强',
      age: 13,
      school: {
        name: '吉山幼儿园',
        address: {
          city: '广州',
          qu: '天河',
          detail: '珠吉路58号'
        }
      }
    }
  },
  mutations: {
    setCount(state, payload) {
      // 第一个形参必然是 state 本身
      // 第二个形参则是传入的数据
      state.count += payload
    }
  },
  actions:{
    // 对象中的每个属性都是一个 action 函数
    // 假设现在要定义一个延时修改 state.count 的函数
    asyncSetCount(store, payload) {
      // action 接到的第一个形参, 是当前的 store 仓库实例
      setTimeout(() => {
        store.commit('setCount', payload)
      },1000)
    }
  },
  getters: {
    filterList: state => state.list.filter(item=>item>5),
    schoolDetail: state => state.student.school.address.detail
  }
})

Vue.config.productionTip = false

new Vue({
  // 挂载到根实例
  store,
  render: h => h(App),
}).$mount('#app')
